<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>2022-8-6晚作业</title>
</head>

<body>
    <script>
        // 距离2022年双11活动还有xx/xxx天xx时xx分xx秒
        //用函数封装一下相差的毫秒转换为天 时 分 秒 
        function time(afterTheTime) {
            //先获取一下当前时间 用一个变量去接
            var currentTime = new Date();
            //获取一下变量的时间
            var afterTheTime = new Date(afterTheTime);
            //discrepancy是剩余时间总的毫秒数↓
            var discrepancy = (afterTheTime - currentTime) / 1000;
            //现在计算天数 用总毫秒数 /60 /60 /24 计算天数
            var day = (Math.floor(discrepancy / 60 / 60 / 24));//计算天数后面会跟小数点 我们在向下取整
            day = day < 10 ? '0' + day : day;////三元运算符  这里说明 如果相差时间小于10天 就在前面补零 例如 09天

            /*
            计算小时
            hour =parseInt(总秒数/60/60%24)计算小时
            */
            var hour = (Math.floor(discrepancy / 60 / 60 % 24))//计算小时 向下取整
            hour = hour < 10 ? '0' + hour : hour;
            // console.log(hour);

            /*
            在计算出分钟
            minute=parseInt(总秒数/60%60)计算分 
            */
            var minute = (Math.floor(discrepancy / 60 % 60));//计算分钟
            minute = minute < 10 ? '0' + minute : minute;//三元运算符  这里说明 如果相差时间小于10小时 就在前面补零 例如 09小时
            // console.log(minute);

            /*
            计算秒  second=parseInt(总秒数%60)计算当前秒
            判断秒小于十 就在前面补0
            */
            var second = (Math.floor(discrepancy % 60));//计算秒
            second = second < 10 ? '0' + second : second;//三元运算符  这里说明 如果相差时间小于10秒 就在前面补零 例如 09秒 
            // console.log(second);
            return '距离双11还剩' + day + '天' + hour + '时' + minute + '分' + second + '秒';
            // document.write(res);
            console.groupEnd();
        }
        //传入双11的时间 
        console.group('双11倒计时:' + '↓↓↓');
        var res = setInterval(function () {
            console.log(time('2022-11-11 00:00:00'));
        }, 1000);



    </script>
</body>

</html>